import React from "react";
import { Button } from 'antd';
import styles from './TextChatDialog.less';

const HistoryTabPane = (props) => {

    const { historyRecords, showMemoryDetail, createNewDialog, showMemoryModal } = props;

    return (
        <div style={{ width: "100%", height: "100%", padding: "5px 0px 0px 20px" }}>
            <div>
                <Button type="dashed" style={{ width: 155, textAlign: "center" }} onClick={() => createNewDialog()}>
                    <i className="ri-chat-1-line" />创建新对话
                </Button>
                <Button type="dashed" style={{ width: 155, textAlign: "center", marginLeft: 20 }} onClick={() => showMemoryModal()}>
                    <i className="ri-coupon-line" />管理对话
                </Button>
            </div>
            <div style={{ height: "100%", padding: "12px 0px 0px 0px", lineHeight: 2.5 }}>
                {
                    historyRecords.map(item => <div className={styles.chat_history_record} onClick={() => showMemoryDetail({ source_id: item.id })}>{item.name}</div>)
                }
            </div>
        </div>
    );
}

export default HistoryTabPane;
